//- 先去这个pug文件中找
extends shopHead.pug

block append pageStyle
	link(href="${relativePath}/static/css/shopping/shopIndex.css" rel="stylesheet" type="text/css")
	link(href="${relativePath}/static/css/shopping/materFinished.css" rel="stylesheet" type="text/css")

block shopContent
	//- 轮播图
	div.bigBanner
		//- swiper
		div.swiper-container
			div.swiper-wrapper
				div.swiper-slide
					img(src="${relativePath}/static/imgs/banner2.jpg")
				div.swiper-slide
					img(src="${relativePath}/static/imgs/banner3.jpg")
			//- 分页器
			div.swiper-pagination.changeColor
			//- 导航按钮
			//- div.swiper-button-prev
			//- div.swiper-button-next
	//- 成品材料内容
	div.matrialCon.layout#mateBox
		div.meterialTabBox
			div.tabBtn
				div.left.fl
					span.zh.current 综合
						i
					span.xl 销量
						i
					//- span.jl 距离
					//- 	i
					//- span.xy 信誉
					//- 	i
					span.price 价格
						i
						em
				//- div.rightPage.fr
				//- 	a.page(href="javascript:;") 
				//- 		| <i class="currentPage">1</i>/<i class="pageCount">100</i>  >
			//- 成品材料列表
			div.meterList
				ul
					//- li
					//- 	a(href="javascript:;")
					//- 		img(src="${relativePath}/static/imgs/clList.png")
					//- 	div.btnProduct
					//- 		p
					//- 			| <i class="fl red">14.00</i>
					//- 			| <span class="fr people">2173人付款</span>
					//- 		p
					//- 			| <i class="fl listT">人像展架</i>
					//- 			| <span class="fr sc">收藏</span>

	
	//- 分页
	div.pageBox
		nav.pageNav
			
			div.paginationOne.page

	//- 成品材料列表模板
	script#finished(type="text/html")
		li(num="{{goods_id}}")
			a(href="javascript:;")
				img(src="{{base_img}}")
			div.btnProduct
				p
					<i class="fl red">{{sell_price}}</i>
					<span class="fr people">{{sale}}人付款</span>
				p
					<i class="fl listT">{{goods_name}}</i>
					| {{if is_collect == 0}}
					| <span class="fr sc">收藏</span>
					| {{else}}
					| <span class="fr sc current">收藏</span>
					| {{/if}}

block append pageScript

	script.
		var MENUNUM = 4;
		$(function(){
			//console.log(token);
			$("#cpcl").addClass("active");
			$("#cpcl").click(function(){
				window.location.href='materFinished.html';
			});
			$("#hyfw1").click(function(){
				window.location.href='industryServiceIndex.html';
			});
			
			$(".left span").click(function(){
				$(this).addClass("current").siblings().removeClass("current");
			})

			/*商品列表点击跳转*/
			$(".meterList").on("click","li img",function(){
				window.location.href="../../view/shopping/madeProcess.html?id="+$(this).closest("li").attr("num");
			})
			//- 成品材料列表销量
			$(".left .xl").click(function() {
				sales(1);
			});
			//- 点击价格
			$(".left .price").toggle(function() {
				price(1,'asc');
				$(this).css("background-image","url(${relativePath}/static/imgs/downb.png)");
			},function(){
				price(1,'desc');
				$(this).css("background-image","url(${relativePath}/static/imgs/downa.png)");
			})
			//- 点击综合
			$(".left .zh").click(function(){
				zhList(1);
			})
			//- 点击商品收藏
			$(".meterList").on("click",".sc",function(){
				if($(this).hasClass("current")) {
					$(this).removeClass('current');
					$.get(shopIp+"/Collection/collectionGoods?userToken="+token+"&goods_id="+$(this).closest("li").attr("num"),function(data) {
						layer.msg("取消成功");
					})
				}else{
					$(this).addClass('current');
					$.get(shopIp+"/Collection/collectionGoods?userToken="+token+"&goods_id="+$(this).closest("li").attr("num"),function(data) {
						layer.msg("收藏成功");
					})
				}
			});

			//- 二级菜单点击
			$(".rightMenu").on("click","li",function(){
				MENUNUM=$(this).attr("code");
				zhList(1);
				//console.log($(".meterialTabBox").offset().top);
			});

			//- 销量列表
			function sales(pageNum){
				$(".meterList ul").html("");
				$.getJSON(shopIp + '/Goods/category?callback=?', {
					userToken:token,
					id:MENUNUM,
					sale:"asc",
					os:"web",
					size:10,
					page:pageNum

				}, function(data) {
					var finishedData = data.data;
					if(finishedData == null) {
						$(".meterList ul").html("<img class='imgBig' src='${relativePath}/static/imgs/zw.png'/>")
						$(".meterList ul").css("text-align","center");
						$(".pageNav").hide()
					}else{
						for(var i=0;i<finishedData.length;i++){
							var finished = template("finished",finishedData[i]);
							$(".meterList ul").append(finished);
						}
						$(".pageNav").show()
						$(".page").html("").pagination({
							pageCount : data.data[0].countPage,
							current : pageNum,
							keepShowPN : true,
							count : 2,
							homePage : "1",
							endPage : data.data[0].countPage,
							coping : true,
							prevContent : "< 上一页",
							nextContent : "下一页 >",
							callback : function(page) {
								sales(page.getCurrent());
							}
						});
					}
				});
			}
			//综合列表
			function zhList(pageNum){
				//alert(MENUNUM);
				$(".meterList ul").html("");
				$.getJSON(shopIp + '/Goods/category?callback=?', {
					userToken:token,
					id:MENUNUM,
					os:"web",
					size:10,
					page:pageNum

				}, function(data) {
					var finishedData = data.data;
					if(finishedData == null) {
						$(".meterList ul").html("<img class='imgBig' src='${relativePath}/static/imgs/zw.png'/>")
						$(".meterList ul").css("text-align","center");
						$(".pageNav").hide()
					}else{
						for(var i=0;i<finishedData.length;i++){
							var finished = template("finished",finishedData[i]);
							$(".meterList ul").append(finished);
						}
						$(".pageNav").show()
						$(".page").html("").pagination({
							pageCount : data.data[0].countPage,
							current : pageNum,
							keepShowPN : true,
							count : 2,
							homePage : "1",
							endPage : data.data[0].countPage,
							coping : true,
							prevContent : "< 上一页",
							nextContent : "下一页 >",
							callback : function(page) {
								zhList(page.getCurrent());
							}
						});
					}
				});
			}

			//- 默认综合显示
			zhList(1);
			//- 价格
			function price(pageNum,syn){
				$(".meterList ul").html("");
				$.getJSON(shopIp + '/Goods/category?callback=?', {
					userToken:token,
					id:MENUNUM,
					sell_price:syn,
					os:"web",
					size:10,
					page:pageNum
				}, function(data) {
					//console.log(data);
					var finishedData = data.data;
					if(finishedData == null) {
						$(".meterList ul").html("<img class='imgBig' src='${relativePath}/static/imgs/zw.png'/>")
						$(".meterList ul").css("text-align","center");
						$(".pageNav").hide()
					}else{
						for(var i=0;i<finishedData.length;i++){
							var finished = template("finished",finishedData[i]);
							//console.log(finished);
							$(".meterList ul").append(finished);
						}
						$(".pageNav").show()
						$(".page").html("").pagination({
							pageCount : data.data[0].countPage,
							current : pageNum,
							keepShowPN : true,
							count : 2,
							homePage : "1",
							endPage : data.data[0].countPage,
							coping : true,
							prevContent : "< 上一页",
							nextContent : "下一页 >",
							callback : function(page) {
								price(page.getCurrent(),syn);
							}
						});
					}
					
				});
			};
		});

		


